/**
 * Created by Administrator on 2017/4/25.
 */
var Password = require('../../../../src/libs/password');
var FormItem = require('../../../../src/libs/form-item');
var Input = require('../../../../src/libs/Input');
var Checkbox = require('../../../../src/libs/checkbox');
var Button = require('../../../../src/libs/button');
var SelectDropDown = require('../../../../src/libs/select-drop-down');

var Agreement = React.createClass({
    getDefaultProps: function () {
        return{
            url:PageDM.URL.value
        }
    },
    getInitialState: function () {
        return{
            url:this.props.url
        }
    },
    render:function () {
        return <a ref="agreement" href={this.state.url.agreement.link} className="fc-link" target="_blank">《{this.state.url.agreement.name}》</a>
    }
});
var BorrowApply = React.createClass({
    getDefaultProps:function(){
        return{
            type:0,
            able:0
        }
    },
    getInitialState: function () {
      return{
          disabled:PageDM.btn.value.disabled,
          banksOption:PageDM.banks.value.options
      }
    },
    componentDidMount:function () {
        var _this = this;

        UEventHub.on(PageDM.banks.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){
            _this.setState({banksOption:v.options},function () {
                var bankRef = _this.refs['banks'];
                if(bankRef){
                    var bankSelect = bankRef.getCurrentSelect();
                    PageDM.banks.value.selectIndex = bankSelect.selectIndex;
                    PageDM.banks.value.selectValue = bankSelect.selectValue;
                    PageDM.banks.value.selectText = bankSelect.selectText;
                }

            });
        });
        PageDM.banks.getCurrentSelect = function () {
            if(_this.refs.banks){
                return _this.refs.banks.getCurrentSelect();
            }else {
                return '';
            }

        };
    },
    getRefs:function (ref) {
        return this.refs[ref];
    },
    backsChange:function (v) {
        PageDM.banks.setValue(v);
        PageDM.banks.onChange && PageDM.banks.onChange(v);
    },
    checkboxClick:function(v){
        PageDM.checkbox.setValue(v);
        PageDM.checkbox.onClick && PageDM.checkbox.onClick(v);
    },
    formatCard:function (pagedm) {
        var val = pagedm.getValue();
        val = UFormatter.formatBankCard(val);
        pagedm.setValue(val);
        pagedm.value = val.replace(/\s/g, "");
    },
    render: function(){
        var _this = this;
        var disableAll  = this.props.able ==1 || this.props.able ==2 ? true: false;
        var disableSome = this.props.able ==2 ? true: false;
        var bank = '';
        if(PageDM.banks.value.selectIndex){
            bank = PageDM.banks.value.options[PageDM.banks.value.selectIndex].option;
        }else if(PageDM.banks.value.selectValue) {
            PageDM.banks.value.options.map(function (item,index) {
                if(item.value == PageDM.banks.value.selectValue){
                    bank = PageDM.banks.value.options[index].option;
                }
            })
        }
        return (
            <div className="form">
                {this.props.type ?
                    <FormItem label="企业姓名" dmbind={PageDM.companyName.dmbind} >
                        {disableAll ?
                            <input className="ucs-input disabled" value={PageDM.companyName.value} disabled dmbind={PageDM.companyName.dmbind}/>:
                            <Input placeholder={PageDM.companyName.placeholder} value={PageDM.companyName.value}  dmbind={PageDM.companyName.dmbind}/>
                        }
                    </FormItem>:''
                }

                <FormItem label="联系人姓名" dmbind={PageDM.contacts.dmbind}>
                    {disableAll ? <input className="ucs-input disabled" value={PageDM.contacts.value} disabled dmbind={PageDM.contacts.dmbind}/>:<Input placeholder={PageDM.contacts.placeholder} value={PageDM.contacts.value} dmbind={PageDM.contacts.dmbind}/>}

                </FormItem>
                <FormItem label="联系人电话" dmbind={PageDM.contactsPhone.dmbind}>
                    {disableAll ? <input className="ucs-input disabled" value={PageDM.contactsPhone.value} disabled dmbind={PageDM.contactsPhone.dmbind}/> : <Input placeholder={PageDM.contactsPhone.placeholder} value={PageDM.contactsPhone.value} dmbind={PageDM.contactsPhone.dmbind}/>}
                </FormItem>
                <FormItem label="开户银行" dmbind={PageDM.banks.dmbind}>
                    <SelectDropDown ref="banks" disabled={disableSome ? true : false} defaultIndex={PageDM.banks.value.selectIndex} defaultValue={PageDM.banks.value.selectValue} options={this.state.banksOption} onChange={_this.backsChange}/>
                     </FormItem>
                <FormItem label="银行账号" dmbind={PageDM.bankNum.dmbind}>
                    {disableSome ? <input className="ucs-input disabled" value={PageDM.bankNum.value} disabled dmbind={PageDM.bankNum.dmbind}/> : <Input placeholder={PageDM.bankNum.placeholder} value={PageDM.bankNum.value}  dmbind={PageDM.bankNum.dmbind} onBlur={_this.formatCard.bind(_this,PageDM.bankNum)}/>}
                </FormItem>
                <div className="ucs-form-group " >
                    <label  className="ucs-label ">发布方式</label>
                    <div className="ucs-input disabled">委托银行代为发布</div>
                    <div className="ucs-form-explain"></div>
                </div>
                {/*formItem必须绑定dmbind,否则报错*/}
                {/*<FormItem label="发布方式">*/}
                    {/*<div className="ucs-input disabled">委托银行代为发布</div>*/}
                {/*</FormItem>*/}

                <div className="form-group check">
                    <label>&nbsp;</label>
                    <Checkbox text=" 我已阅读并同意" value={PageDM.checkbox.value} onClick={this.checkboxClick} dmbind={PageDM.checkbox.dmbind}/>
                    <Agreement ref="agreement"/>
                </div>

                <div className="button">
                    <Button value="立即申请" className={_this.state.disabled ? 'btn btn-confirm ucs-btn-disabled':'btn btn-confirm ' } disabled={_this.state.disabled} onClick={PageDM.btn.onClick}/>
                </div>
                <span className="angle angle-left"></span>
                <span className="angle angle-right"></span>
            </div>
        )
    }
});
module.exports = BorrowApply;